<template>
  <div class="taskInfo">
    <div class="task">
      <div v-for="(item, index) in task" :key="index" class="taskbox">
        <div class="leftbox">
          <img :src="require(`../assets/img/book/${item.bookimg}`)" alt=""/>
          
        </div>
        <div class="midbox">
          <div>任务：{{ item.taskname }}</div>
          <div>类型：{{ item.action }}</div>
          <div>描述：{{ item.details }}</div>
          <div>书籍：{{ item.book }}</div>
        </div>
        <div class="rightbox">
          <div>开始时间：{{ item.stime }}</div>
          <div>结束时间：{{ item.etime }}</div>
          <button class="btn">开始任务</button>
        </div>

        
      </div>
    </div>
  </div>
</template>

<script>
import axios from "axios";
export default {
  data() {
    return {
      task: [],
    };
  },
  methods: {
    s() {},
  },
  mounted() {
    axios
      .post("http://localhost:3000/api/user/showtask", {})
      .then((response) => {
        console.log(response.data);
        this.task = response.data;
      });
  },
};
</script>

<style scoped>
@import "../assets/css/mytask.css";
</style>